<template>
    <div class="card-box">
        <el-row class="mb20">
            <el-col :md="24" class="float-right">
                <router-link to="/announcements/new">
                    <el-button type="primary">新增</el-button>
                </router-link>
            </el-col>
        </el-row>
        <el-table :data="tableData" stripe border style="width: 100%">
            <el-table-column prop="name" label="公告名称" width="400">
                <template slot-scope="scope">
                    <span class="link" @click="getDetail(scope.row)">{{ scope.row.name}}</span>
                </template>
            </el-table-column>
            <el-table-column prop="time" label="创建时间" width="400">
            </el-table-column>
            <el-table-column prop="methods" label="操作">
                <template slot-scope="scope">
                    <el-button size="mini" @click="editData(scope.row)">
                        编辑</el-button>
                    <el-button size="mini" type="danger" @click="deleteSingData(scope.row)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                tableData: [
                    {
                        id: 1,
                        name: '公告新',
                        time: '2018-05-30 19:35:23'
                    }
                ]
            }
        },
        methods: {
            editData() {
                this.$router.push({
                    path: `/announcements/edit`
                })
            },
            getDetail(goods) {
                this.$router.push({
                    path: `/announcements/${goods.id}`
                })
            }
        }
    }
</script>

<style scoped>

</style>